<template>
	<div class="article-lists">
		<el-card class="!border-none" shadow="never">
			<el-form ref="formRef" class="mb-[-16px]" :model="queryParams" :inline="true" label-width="130px">
                <el-form-item label="交易时间" class="piker">
					<el-date-picker
						v-model="queryParams.create_time"
						type="date"
						format="YYYY-MM-DD"
						value-format="YYYY-MM-DD"
						placeholder="请选择日期"
					/>
				</el-form-item>
                <el-form-item label="场景类型">
					<el-select
						class="w-60"
						v-model="queryParams.type"
						placeholder="请选择"
						clearable
					>
						<el-option label="全部" value/>
						<el-option label="申请渠道成功" :value="1"/>
						<el-option label="渠道费支付" :value="2"/>
                        <el-option label="抵扣平台服务费" :value="6"/>
						<el-option label="抵扣租金" :value="4"/>
                        <el-option label="冲正-抵扣租金" :value="8"/>
						<el-option label="抵扣渠道费" :value="3"/>
                        <el-option label="冲正-抵扣渠道费" :value="7"/>
						<el-option label="过期" :value="5"/>
						<el-option label="抵扣转介费、平台服务费" :value="9"/>
					</el-select>
				</el-form-item>
				<el-form-item label="收支类型">
					<el-select
						class="w-60"
						v-model="queryParams.add_type"
						placeholder="请选择"
						clearable
					>
						<el-option label="全部" value/>
						<el-option label="收入" :value="1"/>
						<el-option label="支出" :value="2"/>
					</el-select>
				</el-form-item>
				<el-form-item label="交易流水号">
					<el-input
						class="w-[240px]"
						v-model="queryParams.sn"
						clearable
					/>
				</el-form-item>
                <el-form-item label="户名">
					<el-input
						class="w-[240px]"
						v-model="queryParams.username"
						clearable
					/>
				</el-form-item>
                <el-form-item label="账号">
					<el-input
						class="w-[240px]"
						v-model="queryParams.account"
						clearable
					/>
				</el-form-item>
                <el-form-item label="对方户名">
					<el-input
						class="w-[240px]"
						v-model="queryParams.from_username"
						clearable
					/>
				</el-form-item>
                <el-form-item label="对方账号">
					<el-input
						class="w-[240px]"
						v-model="queryParams.from_account"
						clearable
					/>
				</el-form-item>
				

				<el-form-item class="w-80">
					<el-button type="primary" @click="resetPage">查询</el-button>
					<el-button @click="resetParams">重置</el-button>
				</el-form-item>
			</el-form>
		</el-card>
		<el-card class="!border-none" shadow="never">
            <el-table size="large" v-loading="pager.loading" :data="pager.lists">
				<el-table-column label="序号" type="index" :index="indexAdd" prop="order_id" min-width="90" fixed />
				<el-table-column label="交易流水号" prop="sn" min-width="180" />
				<el-table-column label="场景类型" prop="type_name" min-width="160" >
                    <template #default="{ row }">
                        <span>{{ row.type_name }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="数量" prop="integral" min-width="120" />
                <el-table-column label="收支类型" prop="add_type" min-width="120">
					<template #default="{ row }">
						<span v-if="row.add_type == 1">收入</span>
						<span v-if="row.add_type == 2">支出</span>
					</template>
				</el-table-column>
                <el-table-column label="户名" prop="username" min-width="120" />
                <el-table-column label="账号" prop="account" min-width="160" />
                <el-table-column label="余额" prop="s_integral" min-width="160" />
                <el-table-column label="对方户名" prop="from_username" min-width="160" />
                <el-table-column label="对方账号" prop="from_account" min-width="160" />
                <el-table-column label="交易时间" prop="create_time" min-width="180" />
                <el-table-column label="关联业务单号" prop="from_sn" min-width="180" >
					<template #default="{ row }">
						<el-link type="primary" @click="() => {
							$router.push({ path: getRoutePath('setting.pay.payConfig/commissionOrderlists'), query: { sn: row.from_sn } })
						}">{{ row.from_sn }}</el-link>
					</template>
				</el-table-column>
                <el-table-column label="备注" prop="content" min-width="220" />
                
				
                <!-- <el-table-column label="账户状态" prop="can_use" min-width="120">
					<template #default="{ row }">
						<span v-if="row.can_use == 0">冻结</span>
						<span v-if="row.can_use == 1">启用</span>
					</template>
				</el-table-column> -->
			</el-table>
			<div class="flex justify-end mt-4">
				<pagination v-model="pager" @change="getLists" />
			</div>
		</el-card>
	</div>
</template>
<script lang="ts" setup name="integralList">
	import { integralList } from '@/api/operation';
	import { usePaging } from '@/hooks/usePaging';
	import {getRoutePath} from '@/router'
	const queryParams:any = reactive({
		create_time: '',
        type: '',
        add_type: '',
        sn: '',
        username: '',
        account: '',
        from_username: '',
        from_account: ''
	})

    const orderTxt = (num:any) => {
        return computed(():string=>{
            let txt = '';
            switch(num) {
                case 1: txt = '申请渠道成功';break;
                case 2: txt = '渠道费支付';break;
                case 3: txt = '抵扣渠道费';break;
                case 4: txt = '抵扣租金';break;
                case 5: txt = '过期';break;
                case 6: txt = '抵扣平台服务费';break;
                case 7: txt = '冲正-抵扣渠道费';break;
                case 8: txt = '冲正-抵扣租金';break;
				case 9: txt = '抵扣转介费、平台服务费';break;
            }
            return txt;
        })
    }

	const route = useRoute()
	const { pager, getLists, resetPage, resetParams } = usePaging({
		fetchFun: integralList,
		params: queryParams
	})
    //账户流水
	const router = useRouter()
    const handleSure = async (user_id : number) => {
		console.log('handleSure')
		window.localStorage.setItem('count', '0')
		router.push({
			path: getRoutePath('user.money/moneyLog'),
			query: {
				user_id
			}
		})
	}
    // 切页序号变化
    const indexAdd = (index: number) => {
        const page = pager.page // 当前页码
        const pagesize = pager.size // 每页条数
        return index + 1 + (page - 1) * pagesize
    }
	// if (route.query.account) {
	// 	queryParams.account = route.query.account;
	// } 
	if (route.query.sn) {
		queryParams.sn = route.query.sn;
	} 
	getLists()
</script>
<style lang="scss" scoped>
.piker{
    width: 370px;
	::v-deep .el-input__wrapper{
		width: 240px;
	}
}

</style>